I couldn't just do @part active here since that part also applies to the time button and may include others down the road, so I went with this since it's how the usage code will look (e.g. ::part(picker-item active)).

I'm open to changing the active part name to picker-item-active instead. The W3C guidelines imply that state-based shadow parts should be non-specific (i.e. it should be part="picker-item active" and not part="picker-item picker-item-active") but doing it that way does lead to somewhat awkward documentation.

Same general idea goes for changing the time button part to time-button-active.

I added a note to update this in the design doc for making the internal picker public: https://ionic-cloud.atlassian.net/browse/FW-4401

This could probably be set on the :host:

:host {
  --picker-highlight-background: var(--ion-color-step-150, #eeeeef);
}

That way you don't need to re-set the background property.

Doing it that way causes the default iOS color to overwrite a custom color applied through ion-datetime. You can only apply it directly to ion-picker-internal when styling the time picker due to shadow nesting, so other things (wheel style datetimes and the month/year picker) don't get styled.

Or in other words, this no longer works:

ion-datetime {
  --picker-highlight-background: pink;
}

Bikeshed: Can we use wheel terminology instead of picker to be consistent with the preferWheel property?

Works for me 👍